// 生成随机uuid(防止多用户请求进度条混乱)
function guid(){
    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy/]g, function(c){
        var r = Math.random()*16|0, v = c == 'x' ? r : (r&0x3|0x8);
        return v.toString(16);
    });
}

$(function () {
        $('.btn').on('click', function () {
                // 生成唯一的uuid
                var uuid = guid();
                // 设置定时器,隔段时间请求一次数据
                var sitv = setInterval(function(){
                    // prog_url指向请求进度的url，后面会在flask中设置
                    var prog_url = '/show_progress/' + uuid
                    $.getJSON(prog_url, function(num_progress){
                        $('.progress-div').css('visibility', 'visible');
                        $('.progress-bar').css('width', num_progress.res + '%');
                        $('.progress-bar').css('background', 'green');
                        $('.progress-bar').css('text-align', 'center');
                        $('.progress-bar').text(num_progress.res + '%');
                    });
                }, 500);
            // 点击事件第一个请求地址，发送请求，后台业务开始执行
            var this_url = '/progress_data/' + uuid
            $.getJSON(this_url, function(res){
                // 清楚定时器
                cleanInterval(sitv);
                if(res.res != null){
                    $('.progress-bar').css('width', '100%');
                    $('.progress-bar').text('100%');
                    setTimeout(function(){
                        alert('下载成功!');
                    }, 100);
                }else{
                    $('.progress-bar').css('background', 'red');
                    setTimeout(function(){
                        alert('失败了!');
                    }, 1);
                }
            });
        })
})